﻿@model Actya.Web.ViewModels.Admin.EditPageViewModel
@{
	ViewBag.Title = String.IsNullOrEmpty(Model.Id) ? "New Page" : "Edit page";
	var action = String.IsNullOrEmpty(Model.Id) ? "Create" : "Update";
}
@if (! String.IsNullOrEmpty(Model.Id) && Model.IsActive) {
	<a href="@Cms.AbsoluteUrl(Model.Url)" style="float:right; line-height:34px; margin-right:5px;">View page</a>
}
<h2>@ViewBag.Title</h2>
@using (Html.BeginForm(action, "Pages")) {
	@Html.AntiForgeryToken()
	@Html.HiddenFor(m => m.Id)
	@Html.HiddenFor(m => m.UrlPrefix)
	<input type="hidden" name="CustomAction" id="CustomAction" />
	<fieldset>
		<div>
			<div class="inline">
				@Html.LabelFor(m => m.PageTitle, "Title")
				@Html.TextBoxFor(m => m.PageTitle, new { @class = "te fe-wide" })
				@Html.ValidationMessageFor(m => m.PageTitle)
			</div>
			<div class="inline">
				
				@Html.LabelFor(m => m.LayoutId, "Layout")
				@Html.DropDownListFor(m => m.LayoutId, new SelectList(Model.AvailablePageLayouts, "Id", "Name", Model.LayoutId), new { @class = "te fe-middle" })
				@Html.ValidationMessageFor(m => m.LayoutId)
			</div>
		</div>
		<a href="#" id="toggleadvanced" style="float:right;margin-right:5px">Advanced properties...</a>
		<div id="advancedproperties" style="display:none" class="extra">
			<div class="clear">
				<div class="inline">
					@Html.LabelFor(m => m.Slug, "Slug")
					@Html.TextBoxFor(m => m.Slug, new { @class = "fe-middle" })
				</div>
				<div class="inline">
					<label>Url</label>
					<span class="fe-readonly">
						@if (! String.IsNullOrEmpty(Model.UrlPrefix)) {
							<span>/@Model.UrlPrefix</span>
						}
					</span>
					@Html.TextBoxFor(m => m.Url, new { @class = "fe-middle" })
				</div>
			</div>
			<div>
				<div class="inline">
					<label>Navigation</label>
					@Html.CheckBoxFor(m => m.IncludeInNavigation)
					<label for="IncludeInNavigation" class="inline">Include in navigation</label>
				</div>
				<div class="inline" id="parentpage">
					<label>Parent page</label>
					<select id="parentid" name="ParentId" class="fe-small">
						<option value="">No parent page</option>
					</select>
				</div>
				<div class="inline" id="menutext">
					@Html.LabelFor(m => m.MenuText)
					@Html.TextBoxFor(m => m.MenuText, new { @class = "fe-small" })
				</div>
				<div class="inline">
					<label>Home page</label>
					@Html.CheckBoxFor(m => m.IsHomePage)
					<label for="IsHomePage" class="inline">Set as home page</label>
				</div>
				<div class="clearleft"></div>
			</div>
		</div>
	</fieldset>
	<div id="contenteditor">
		@Html.Partial("_ContentEditor", Model)
	</div>
	<fieldset>
		<a href="#" id="togglepublication" style="float:right;margin-right:5px">Publication settings...</a>
		<div id="publicationsettings"  style="display:none" class="extra">
			<div class="clear">
				<div class="inline">
					@Html.LabelFor(m => m.IsPublished, "Is published")
					@Html.HiddenFor(m => m.IsPublished)
					@Html.CheckBoxFor(m => m.IsPublished, new { disabled = "disabled" })					
				</div>
				<div class="inline">
					@Html.LabelFor(m => m.PublicationDate, "Published from")
					@Html.EditorFor(m => m.PublicationDate, "DateTimePicker")
					@Html.ValidationMessageFor(m => m.PublicationDate)
				</div>
				<div class="inline">
					@Html.LabelFor(m => m.OfflineDate, "Published until")
					@Html.EditorFor(m => m.OfflineDate, "DateTimePicker")
					@Html.ValidationMessageFor(m => m.OfflineDate)
				</div>
				<div class="inline">
					@if (Model.IsPublished) {
						<br />
						<input id="unpublish" type="button" value="Unpublish" />
					}
				</div>
				<div class="clearleft"></div>
			</div>
		</div>
	</fieldset>
	<p>
		<input type="submit" value="Save" /> 
		@if (! Model.IsPublished) { <input type="submit" name="@Constants.SaveAndPublishName" value="Save and Publish" /> } 
		<input type="button" id="preview" value="Preview" />
		or @Html.ActionLink("Go to page list", "Index")
	</p>
	<div id="previewdialog">
		<iframe id="previewiframe" width="100%" height="100%" marginWidth="0" marginHeight="0" frameBorder="0" scrolling="auto" title="Preview"></iframe>
	</div>
}
@section head {
	@Cms.ScriptInclude("Themes/Admin/Scripts/jquery.stringToSlug.js")
}
<script type="text/javascript">
	$(document).ready(function () {

		$('#LayoutId').change(function () {
			var $form = $(this).closest('form');
			$form.attr("action", "@Url.Action("ChangeLayout")");
			$form.submit();
		});

		$('#PageTitle').stringToSlug({
			getPut: "#Slug",
			setEvents: "keyup"
		});

		$('#IncludeInNavigation').change(function () {
			toggleParentPage();
		});

		$('#PageTitle, #Slug, #parentid').change(function () {
			updateUrl();
		});

		$('#toggleadvanced').toggle(function () {
			$('#advancedproperties').show();
			$(this).text("Hide advanced properties");
			return false;
		}, function () {
			$('#advancedproperties').hide();
			$(this).text("Advanced properties...");
			return false;
		});

		$('#togglepublication').toggle(function () {
			$('#publicationsettings').show();
			$(this).text("Hide publication settings");
			return false;
		}, function () {
			$('#publicationsettings').hide();
			$(this).text("Publication settings...");
			return false;
		});

		$('#unpublish').click(function() {
			var $form = $(this).closest('form');
			$form.attr("action", "@Url.Action("UnPublish")");
			$form.submit();
		});

		$('#preview').click(function() {
			var $form = $(this).closest('form');
			$.ajax({
				type: 'POST',
				data: $form.serialize(),
				url: "@Url.Action("Preview")",
				success: function (data) {
					$("#previewiframe").attr("src", data);
					$("#previewdialog").dialog("open");
				},
				error: function() {
					alert("Unable to preview the page. Did you fill in all required fields?");
				}
			});
			return false;
		});

		$("#previewdialog").dialog({
			bgiframe: true,
			autoOpen: false,
			height: 700,
			width: "90%",
			modal: true
		});


		toggleParentPage();
	});

	function toggleParentPage() {
		if ($('#IncludeInNavigation').is(':checked')) {
			$('#parentpage').show();
			$('#menutext').show();
			if ($('#MenuText').val() == "") {
				$('#MenuText').val($('#PageTitle').val());
			}
			if ($('#parentid').children('option').length == 1) {
				var url = '@Url.Action("GetFlattenedSitemapNodes", "Sitemap")';
				$.getJSON(url, function(data) {
					$.each(data, function(idx, node) {
						var indent = node.Level * 20;
						if (node.PageId != $('#Id').val()) {
							var option = $('#parentid')
								.append($("<option></option>")
								.attr("value", node.Id)
								.attr("data-url", node.Url)
								.attr("style", "padding-left:" + indent + "px;")
								.text(node.Title)); 
						}
					});
					$('#parentid').val("@Model.ParentId");
				});
			}
		} else {
			$('#parentpage').hide();
			$('#menutext').hide();
		}
	}

	function updateUrl() {
		var parentUrl = "";
		var selectedParent = $('#parentid').find('option:selected');
		if (selectedParent.length > 0 && selectedParent.val() != "") {
			var url = selectedParent.data('url');
			if (url.indexOf('/', url.length - 1) !== -1) {
				parentUrl = url; 
			}
		}
		var slug = $('#Slug').val();
		var theUrl = parentUrl != "" 
			? parentUrl + slug + "/" 
			: slug != "" ? "/" + slug + "/" : "/"; 
		$('#Url').val(theUrl);
	}
</script>
